<template>
  <div class="appraisal-management">
    <!-- 页面头部 -->
    <header class="page-header">
      <div class="header-content">
        <div class="header-left">
          <h1 class="page-title">鉴定管理</h1>
          <p class="page-subtitle">管理和跟踪案件相关的鉴定工作</p>
        </div>
        <div class="header-actions">
          <el-button type="primary" @click="showAddDialog = true">
            <i class="fas fa-plus mr-2"></i>申请鉴定
          </el-button>
          <el-button @click="refreshData">
            <i class="fas fa-sync-alt mr-2"></i>刷新
          </el-button>
        </div>
      </div>
    </header>

    <!-- 统计卡片 -->
    <div class="stats-section">
      <div class="stats-grid">
        <div class="stat-card">
          <div class="stat-icon bg-blue-100">
            <i class="fas fa-clipboard-list text-blue-600"></i>
          </div>
          <div class="stat-content">
            <h3>{{ totalAppraisals }}</h3>
            <p>总鉴定数</p>
          </div>
        </div>
        
        <div class="stat-card">
          <div class="stat-icon bg-yellow-100">
            <i class="fas fa-clock text-yellow-600"></i>
          </div>
          <div class="stat-content">
            <h3>{{ pendingAppraisals }}</h3>
            <p>待鉴定</p>
          </div>
        </div>
        
        <div class="stat-card">
          <div class="stat-icon bg-green-100">
            <i class="fas fa-check-circle text-green-600"></i>
          </div>
          <div class="stat-content">
            <h3>{{ completedAppraisals }}</h3>
            <p>已完成</p>
          </div>
        </div>
        
        <div class="stat-card">
          <div class="stat-icon bg-red-100">
            <i class="fas fa-exclamation-triangle text-red-600"></i>
          </div>
          <div class="stat-content">
            <h3>{{ urgentAppraisals }}</h3>
            <p>紧急处理</p>
          </div>
        </div>
      </div>
    </div>

    <!-- 页签导航 -->
    <div class="tabs-section">
      <el-tabs v-model="activeTab" @tab-change="handleTabChange" class="appraisal-tabs">
        <el-tab-pane label="待鉴定" name="pending">
          <template #label>
            <span class="tab-label">
              <i class="fas fa-clock mr-2"></i>
              待鉴定 ({{ pendingAppraisals }})
            </span>
          </template>
        </el-tab-pane>
        <el-tab-pane label="鉴定中" name="in-progress">
          <template #label>
            <span class="tab-label">
              <i class="fas fa-cog mr-2"></i>
              鉴定中 ({{ inProgressAppraisals }})
            </span>
          </template>
        </el-tab-pane>
        <el-tab-pane label="鉴定完成" name="completed">
          <template #label>
            <span class="tab-label">
              <i class="fas fa-check-circle mr-2"></i>
              鉴定完成 ({{ completedAppraisals }})
            </span>
          </template>
        </el-tab-pane>
      </el-tabs>
    </div>

    <!-- 筛选区域 -->
    <div class="filter-section">
      <div class="filter-content">
        <div class="search-box">
          <el-input
            v-model="searchKeyword"
            placeholder="搜索鉴定编号、案件名称..."
            size="large"
            clearable
          >
            <template #prefix>
              <i class="fas fa-search"></i>
            </template>
          </el-input>
        </div>
        
        <div class="filter-controls">
          <!-- 案件阶段筛选 -->
          <div class="stage-filter">
            <label class="filter-label">案件阶段：</label>
            <el-select 
              v-model="filters.stages" 
              multiple 
              placeholder="请选择案件阶段" 
              style="width: 240px"
              @change="applyFilters"
              clearable
              collapse-tags
              collapse-tags-tooltip
            >
              <el-option label="诉前" value="pre-litigation"></el-option>
              <el-option label="诉中" value="litigation"></el-option>
              <el-option label="和谈" value="mediation"></el-option>
            </el-select>
          </div>
          
          <!-- 鉴定类型筛选 -->
          <div class="stage-filter">
            <label class="filter-label">鉴定类型：</label>
            <el-select 
              v-model="filters.type" 
              placeholder="请选择鉴定类型" 
              style="width: 240px"
              @change="applyFilters"
              clearable
            >
              <el-option label="司法鉴定" value="judicial"></el-option>
              <el-option label="医疗鉴定" value="medical"></el-option>
              <el-option label="工伤鉴定" value="injury"></el-option>
              <el-option label="交通事故鉴定" value="traffic"></el-option>
              <el-option label="其他鉴定" value="other"></el-option>
            </el-select>
          </div>
          
          <!-- 鉴定机构筛选 -->
          <div class="stage-filter">
            <label class="filter-label">鉴定机构：</label>
            <el-select 
              v-model="filters.institution" 
              placeholder="请选择鉴定机构" 
              style="width: 240px"
              @change="applyFilters"
              clearable
            >
              <el-option label="北京市司法鉴定中心" value="beijing-judicial"></el-option>
              <el-option label="中汽研汽车检验中心" value="catarc"></el-option>
              <el-option label="市公安局法医鉴定中心" value="police-forensic"></el-option>
              <el-option label="省司法鉴定协会" value="provincial-judicial"></el-option>
              <el-option label="交通事故司法鉴定所" value="traffic-forensic"></el-option>
              <el-option label="道路交通事故鉴定中心" value="road-traffic"></el-option>
            </el-select>
          </div>
          
          <el-button type="primary" @click="applyFilters">筛选</el-button>
          <el-button @click="clearFilters">重置</el-button>
        </div>
      </div>

      <!-- 批量操作区域 -->
      <div v-if="selectedCases.length > 0" class="batch-actions">
        <div class="batch-info">
          <span>已选择 {{ selectedCases.length }} 个案件</span>
        </div>
        <div class="batch-buttons">
          <!-- 待鉴定状态下显示录入按钮 -->
          <template v-if="activeTab === 'pending'">
            <el-button type="success" @click="batchInputAppraisal">
              <i class="fas fa-edit mr-2"></i>
              录入鉴定信息
            </el-button>
          </template>
          <el-button type="primary" @click="batchSchedule">
            <i class="fas fa-calendar-plus mr-2"></i>
            批量预约
          </el-button>
          <el-button @click="clearSelection">取消选择</el-button>
        </div>
      </div>
    </div>

    <!-- 鉴定列表 -->
    <div class="appraisal-list-section">
      <div class="appraisal-table">
        <el-table 
          :data="filteredAppraisals" 
          style="width: 100%" 
          v-loading="loading"
          @selection-change="handleSelectionChange"
        >
          <!-- 选择列 -->
          <el-table-column 
            v-if="activeTab !== 'completed'"
            type="selection" 
            width="55"
            :selectable="isSelectable"
          ></el-table-column>
          
          <el-table-column prop="appraisalNo" label="鉴定编号" width="150">
            <template #default="scope">
              <span class="font-medium text-blue-600 cursor-pointer" @click="viewAppraisal(scope.row)">
                {{ scope.row.appraisalNo }}
              </span>
            </template>
          </el-table-column>
          
          <el-table-column prop="caseTitle" label="案件名称" width="200"></el-table-column>
          
          <!-- 案件阶段 -->
          <el-table-column prop="stage" label="案件阶段" width="100">
            <template #default="scope">
              <el-tag :type="getStageColor(scope.row.stage)" size="small">
                {{ getStageName(scope.row.stage) }}
              </el-tag>
            </template>
          </el-table-column>
          
          <el-table-column prop="type" label="鉴定类型" width="120">
            <template #default="scope">
              <el-tag :type="getTypeColor(scope.row.type)">
                {{ getTypeName(scope.row.type) }}
              </el-tag>
            </template>
          </el-table-column>
          
          <el-table-column prop="institution" label="鉴定机构" width="150"></el-table-column>
          
          <!-- 材料状态 -->
          <el-table-column prop="materialStatus" label="材料状态" width="120">
            <template #default="scope">
              <div class="material-status">
                <el-tag 
                  :type="scope.row.materialStatus === 'complete' ? 'success' : 'warning'" 
                  size="small"
                >
                  {{ scope.row.materialStatus === 'complete' ? '已齐全' : '待补充' }}
                </el-tag>
              
              </div>
            </template>
          </el-table-column>
          
          <!-- 排期列（仅待鉴定状态显示） -->
          <el-table-column 
            v-if="activeTab === 'pending'"
            prop="schedule" 
            label="排期" 
            width="120"
          >
            <template #default="scope">
              <el-tag 
                :type="scope.row.schedule ? 'success' : 'info'" 
                size="small"
              >
                {{ scope.row.schedule || '未排期' }}
              </el-tag>
            </template>
          </el-table-column>
          
          <el-table-column prop="estimatedDate" label="预计完成" width="120">
            <template #default="scope">
              {{ formatDate(scope.row.estimatedDate) }}
            </template>
          </el-table-column>
          
          <el-table-column prop="cost" label="费用" width="100">
            <template #default="scope">
              ￥{{ scope.row.cost.toLocaleString() }}
            </template>
          </el-table-column>
          
          <!-- 赔偿系数（仅完成状态显示） -->
          <el-table-column 
            v-if="activeTab === 'completed'"
            prop="compensationRatio" 
            label="赔偿系数" 
            width="120"
          >
            <template #default="scope">
              <span v-if="scope.row.compensationRatio" class="font-medium text-green-600">
                {{ scope.row.compensationRatio }}%
              </span>
              <span v-else class="text-gray-400">-</span>
            </template>
          </el-table-column>
          
          <!-- 报告状态（仅完成状态显示） -->
          <el-table-column 
            v-if="activeTab === 'completed'"
            prop="reportStatus" 
            label="报告状态" 
            width="120"
          >
            <template #default="scope">
              <el-tag :type="getReportStatusColor(scope.row.reportStatus)">
                {{ getReportStatusText(scope.row.reportStatus) }}
              </el-tag>
            </template>
          </el-table-column>
          
          <el-table-column label="操作" width="280" fixed="right">
            <template #default="scope">
              <!-- 待鉴定状态操作 -->
              <template v-if="activeTab === 'pending'">
                <el-button size="small" type="success" @click="inputAppraisalInfo(scope.row)">
                  录入信息
                </el-button>
              </template>
              
              <!-- 鉴定中状态操作 -->
              <template v-if="activeTab === 'in-progress'">
                <el-button size="small" type="success" @click="uploadReport(scope.row)">
                  上传报告
                </el-button>
                <el-button size="small" type="warning" @click="manageMissingMaterials(scope.row)">
                  缺少检材
                </el-button>
                <el-button size="small" @click="addRemark(scope.row)">
                  添加备注
                </el-button>
              </template>
              
              <!-- 已完成状态操作 -->
              <template v-if="activeTab === 'completed'">
                <el-button size="small" type="info" @click="viewReport(scope.row)">
                  查看报告
                </el-button>
                <el-button size="small" @click="printMaterials(scope.row)">
                  打印材料
                </el-button>
              </template>
              
              <el-button size="small" type="danger" @click="deleteAppraisal(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        
        <!-- 分页 -->
        <div class="pagination-section">
          <el-pagination
            v-model:current-page="currentPage"
            v-model:page-size="pageSize"
            :page-sizes="[10, 20, 50]"
            :total="filteredAppraisals.length"
            layout="total, sizes, prev, pager, next, jumper"
          />
        </div>
      </div>
    </div>

    <!-- 添加鉴定对话框 -->
    <el-dialog v-model="showAddDialog" title="申请鉴定" width="60%">
      <el-form :model="newAppraisal" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="案件名称">
              <el-input v-model="newAppraisal.caseTitle" placeholder="请输入案件名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="鉴定类型">
              <el-select v-model="newAppraisal.type" placeholder="请选择鉴定类型" style="width: 100%">
                <el-option label="司法鉴定" value="judicial"></el-option>
                <el-option label="医疗鉴定" value="medical"></el-option>
                <el-option label="工伤鉴定" value="injury"></el-option>
                <el-option label="交通事故鉴定" value="traffic"></el-option>
                <el-option label="其他鉴定" value="other"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="鉴定机构">
              <el-input v-model="newAppraisal.institution" placeholder="请输入鉴定机构"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="预计费用">
              <el-input v-model="newAppraisal.cost" type="number" placeholder="预计费用"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        
        <el-form-item label="鉴定说明">
          <el-input
            v-model="newAppraisal.description"
            type="textarea"
            :rows="3"
            placeholder="请输入鉴定说明"
          ></el-input>
        </el-form-item>
      </el-form>
      
      <template #footer>
        <el-button @click="showAddDialog = false">取消</el-button>
        <el-button type="primary" @click="addAppraisal">提交申请</el-button>
      </template>
    </el-dialog>

    <!-- 鉴定排期管理对话框 -->
    <el-dialog v-model="showScheduleDialog" title="鉴定排期管理" width="800px">
      <div class="schedule-management">
        <!-- 日历选择 -->
        <div class="calendar-section">
          <h4 class="section-title">
            <i class="fas fa-calendar-alt text-blue-600 mr-2"></i>
            选择鉴定日期
          </h4>
          <el-calendar v-model="selectedDate" @panel-change="handleDateChange">
            <template #date-cell="{ data }">
              <div class="calendar-cell">
                <span class="date-number">{{ data.day.split('-').pop() }}</span>
                <div v-if="getScheduleCount(data.day)" class="schedule-indicator">
                  {{ getScheduleCount(data.day) }}个案件
                </div>
              </div>
            </template>
          </el-calendar>
        </div>

        <!-- 当日案件列表 -->
        <div v-if="selectedDateCases.length > 0" class="date-cases">
          <h4 class="section-title">
            <i class="fas fa-list text-green-600 mr-2"></i>
            {{ formatDate(selectedDate) }} 的鉴定安排
          </h4>
          <el-table :data="selectedDateCases" size="small">
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="appraisalNo" label="鉴定编号" width="120"></el-table-column>
            <el-table-column prop="caseTitle" label="案件名称" width="180"></el-table-column>
            <el-table-column prop="institution" label="鉴定机构" width="150"></el-table-column>
            <el-table-column prop="type" label="类型" width="100">
              <template #default="scope">
                <el-tag size="small" :type="getTypeColor(scope.row.type)">
                  {{ getTypeName(scope.row.type) }}
                </el-tag>
              </template>
            </el-table-column>
          </el-table>
        </div>

        <!-- 待分配案件 -->
        <div class="pending-cases">
          <h4 class="section-title">
            <i class="fas fa-clock text-orange-600 mr-2"></i>
            待分配案件
          </h4>
          <el-table 
            :data="pendingScheduleCases" 
            size="small"
            @selection-change="handlePendingSelectionChange"
          >
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column prop="appraisalNo" label="鉴定编号" width="120"></el-table-column>
            <el-table-column prop="caseTitle" label="案件名称" width="180"></el-table-column>
            <el-table-column prop="institution" label="鉴定机构" width="150"></el-table-column>
            <el-table-column prop="stage" label="阶段" width="80">
              <template #default="scope">
                <el-tag size="small" :type="getStageColor(scope.row.stage)">
                  {{ getStageName(scope.row.stage) }}
                </el-tag>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showScheduleDialog = false">取消</el-button>
          <el-button 
            type="primary" 
            @click="confirmSchedule"
            :disabled="selectedPendingCases.length === 0"
          >
            <i class="fas fa-check mr-2"></i>
            确定安排
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 材料管理对话框 -->
    <el-dialog v-model="showMaterialDialog" title="案件材料管理" width="700px">
      <div class="material-management">
        <!-- 案件信息 -->
        <div class="case-info">
          <h4 class="info-title">
            <i class="fas fa-folder text-blue-600 mr-2"></i>
            案件信息
          </h4>
          <div class="info-grid">
            <div class="info-item">
              <span class="info-label">鉴定编号：</span>
              <span class="info-value">{{ currentAppraisal?.appraisalNo }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">案件名称：</span>
              <span class="info-value">{{ currentAppraisal?.caseTitle }}</span>
            </div>
          </div>
        </div>

        <!-- 材料清单 -->
        <div class="material-checklist">
          <h4 class="section-title">
            <i class="fas fa-clipboard-check text-green-600 mr-2"></i>
            材料清单
          </h4>
          <div class="checklist-grid">
            <el-checkbox-group v-model="materialForm.checkedMaterials">
              <div v-for="material in requiredMaterials" :key="material.id" class="material-item">
                <el-checkbox :label="material.id" :disabled="material.completed">
                  <div class="material-content">
                    <span class="material-name">{{ material.name }}</span>
                    <el-tag 
                      v-if="material.completed" 
                      type="success" 
                      size="small"
                    >
                      已提供
                    </el-tag>
                    <el-tag 
                      v-else-if="material.required" 
                      type="danger" 
                      size="small"
                    >
                      必需
                    </el-tag>
                  </div>
                </el-checkbox>
              </div>
            </el-checkbox-group>
          </div>
        </div>

        <!-- 材料上传 -->
        <div class="material-upload">
          <h4 class="section-title">
            <i class="fas fa-upload text-purple-600 mr-2"></i>
            补充材料
          </h4>
          <el-upload
            :before-upload="beforeMaterialUpload"
            :on-change="handleMaterialChange"
            :auto-upload="false"
            multiple
            accept=".pdf,.doc,.docx,.jpg,.jpeg,.png"
            drag
          >
            <div class="upload-hint">
              <i class="fas fa-cloud-upload-alt text-2xl text-gray-400 mb-2"></i>
              <div class="text-gray-600 mb-1">点击或拖拽文件到此区域上传</div>
              <div class="text-gray-400 text-sm">支持 PDF、Word、图片格式</div>
            </div>
          </el-upload>
        </div>

        <!-- 材料预览 -->
        <div v-if="materialFiles.length > 0" class="material-preview">
          <h4 class="section-title">
            <i class="fas fa-eye text-indigo-600 mr-2"></i>
            材料预览
          </h4>
          <div class="file-grid">
            <div v-for="(file, index) in materialFiles" :key="index" class="file-card">
              <div class="file-icon">
                <i :class="getFileIcon(file.name)" class="text-2xl"></i>
              </div>
              <div class="file-info">
                <div class="file-name">{{ file.name }}</div>
                <div class="file-size">{{ formatFileSize(file.size) }}</div>
              </div>
              <div class="file-actions">
                <el-button type="text" size="small" @click="previewFile(file)">
                  <i class="fas fa-eye"></i>
                </el-button>
                <el-button type="text" size="small" @click="removeMaterialFile(index)">
                  <i class="fas fa-times text-red-500"></i>
                </el-button>
              </div>
            </div>
          </div>
        </div>

        <!-- 备注说明 -->
        <div class="material-remark">
          <label class="form-label">备注说明</label>
          <el-input
            v-model="materialForm.remark"
            type="textarea"
            :rows="3"
            placeholder="请输入材料相关说明或备注..."
          />
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showMaterialDialog = false">取消</el-button>
          <el-button type="primary" @click="saveMaterials">
            <i class="fas fa-save mr-2"></i>
            保存材料
          </el-button>
          <el-button type="success" @click="printMaterials(currentAppraisal)">
            <i class="fas fa-print mr-2"></i>
            打印材料
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 添加备注对话框 -->
    <el-dialog v-model="showRemarkDialog" title="添加备注" width="500px">
      <el-form :model="remarkForm" label-width="80px">
        <el-form-item label="备注时间">
          <el-date-picker
            v-model="remarkForm.time"
            type="datetime"
            placeholder="选择时间"
            style="width: 100%"
          />
        </el-form-item>
        <el-form-item label="备注内容">
          <el-input
            v-model="remarkForm.content"
            type="textarea"
            :rows="4"
            placeholder="请输入备注内容..."
          />
        </el-form-item>
        <el-form-item label="备注类型">
          <el-select v-model="remarkForm.type" placeholder="选择类型" style="width: 100%">
            <el-option label="进展更新" value="progress"></el-option>
            <el-option label="问题记录" value="issue"></el-option>
            <el-option label="沟通记录" value="communication"></el-option>
            <el-option label="其他说明" value="other"></el-option>
          </el-select>
        </el-form-item>
      </el-form>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showRemarkDialog = false">取消</el-button>
          <el-button type="primary" @click="saveRemark">
            <i class="fas fa-save mr-2"></i>
            保存备注
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 上传鉴定报告对话框 -->
    <el-dialog v-model="showUploadDialog" title="上传鉴定报告" width="600px">
      <div class="upload-report-content">
        <!-- 鉴定信息 -->
        <div class="appraisal-info">
          <h4 class="info-title">
            <i class="fas fa-info-circle text-blue-600 mr-2"></i>
            鉴定信息
          </h4>
          <div class="info-grid">
            <div class="info-item">
              <span class="info-label">鉴定编号：</span>
              <span class="info-value">{{ currentAppraisal?.appraisalNo }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">案件名称：</span>
              <span class="info-value">{{ currentAppraisal?.caseTitle }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">鉴定机构：</span>
              <span class="info-value">{{ currentAppraisal?.institution }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">鉴定类型：</span>
              <span class="info-value">{{ getTypeName(currentAppraisal?.type) }}</span>
            </div>
          </div>
        </div>

        <!-- 报告上传区域 -->
        <div class="upload-section">
          <h4 class="section-title">
            <i class="fas fa-upload text-green-600 mr-2"></i>
            上传鉴定报告
          </h4>
          
          <!-- 文件上传 -->
          <div class="file-upload-area">
            <el-upload
              ref="uploadRef"
              :before-upload="beforeUpload"
              :on-change="handleFileChange"
              :on-remove="handleFileRemove"
              :auto-upload="false"
              multiple
              accept=".pdf,.doc,.docx,.jpg,.jpeg,.png"
              drag
            >
              <div class="upload-hint">
                <i class="fas fa-cloud-upload-alt text-4xl text-gray-400 mb-3"></i>
                <div class="text-gray-600 text-lg mb-2">点击或拖拽文件到此区域上传</div>
                <div class="text-gray-400 text-sm">
                  支持 PDF、Word 文档、图片格式<br/>
                  单个文件大小不超过 50MB
                </div>
              </div>
            </el-upload>
          </div>

          <!-- 已上传文件列表 -->
          <div v-if="uploadedFiles.length > 0" class="uploaded-files">
            <h5 class="files-title">已选择的文件</h5>
            <div class="file-list">
              <div 
                v-for="(file, index) in uploadedFiles" 
                :key="index"
                class="file-item"
              >
                <div class="file-info">
                  <i class="fas fa-file-alt text-blue-500 mr-2"></i>
                  <span class="file-name">{{ file.name }}</span>
                  <span class="file-size">({{ formatFileSize(file.size) }})</span>
                </div>
                <el-button 
                  type="text" 
                  size="small" 
                  @click="removeFile(index)"
                  class="text-red-500"
                >
                  <i class="fas fa-times"></i>
                </el-button>
              </div>
            </div>
          </div>

          <!-- 报告说明 -->
          <div class="report-description">
            <label class="form-label">报告说明</label>
            <el-input
              v-model="reportForm.description"
              type="textarea"
              :rows="3"
              placeholder="请输入报告相关说明或备注..."
            />
          </div>

          <!-- 报告类型 -->
          <div class="report-type">
            <label class="form-label">报告类型</label>
            <el-checkbox-group v-model="reportForm.reportTypes">
              <el-checkbox label="original">原件报告</el-checkbox>
              <el-checkbox label="copy">复印件</el-checkbox>
              <el-checkbox label="electronic">电子版</el-checkbox>
              <el-checkbox label="supplementary">补充材料</el-checkbox>
            </el-checkbox-group>
          </div>
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showUploadDialog = false">取消</el-button>
          <el-button 
            type="primary" 
            @click="confirmUploadReport"
            :disabled="uploadedFiles.length === 0"
            :loading="uploading"
          >
            <i class="fas fa-upload mr-2"></i>
            {{ uploading ? '上传中...' : '确认上传' }}
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 缺少检材管理对话框 -->
    <el-dialog v-model="showMissingMaterialDialog" title="缺少检材管理" width="800px">
      <div class="missing-material-management">
        <!-- 案件信息 -->
        <div class="case-info">
          <h4 class="info-title">
            <i class="fas fa-folder text-blue-600 mr-2"></i>
            案件信息
          </h4>
          <div class="info-grid">
            <div class="info-item">
              <span class="info-label">鉴定编号：</span>
              <span class="info-value">{{ currentAppraisal?.appraisalNo }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">案件名称：</span>
              <span class="info-value">{{ currentAppraisal?.caseTitle }}</span>
            </div>
            <div class="info-item">
              <span class="info-label">鉴定机构：</span>
              <span class="info-value">{{ currentAppraisal?.institution }}</span>
            </div>
          </div>
        </div>

        <!-- 检材清单 -->
        <div class="specimen-checklist">
          <h4 class="section-title">
            <i class="fas fa-exclamation-triangle text-orange-600 mr-2"></i>
            缺失检材清单
          </h4>
          <div class="specimen-grid">
            <el-checkbox-group v-model="missingMaterialForm.selectedSpecimens">
              <div v-for="specimen in specimenList" :key="specimen.id" class="specimen-item">
                <el-checkbox :label="specimen.id">
                  <div class="specimen-content">
                    <div class="specimen-info">
                      <span class="specimen-name">{{ specimen.name }}</span>
                      <span class="specimen-desc">{{ specimen.description }}</span>
                    </div>
                    <el-tag 
                      :type="specimen.urgent ? 'danger' : 'warning'" 
                      size="small"
                    >
                      {{ specimen.urgent ? '紧急' : '缺少' }}
                    </el-tag>
                  </div>
                </el-checkbox>
              </div>
            </el-checkbox-group>
          </div>
        </div>

        <!-- 缺失原因 -->
        <div class="missing-reason">
          <label class="form-label">
            <i class="fas fa-question-circle mr-1"></i>
            缺失原因
          </label>
          <el-select v-model="missingMaterialForm.reason" placeholder="请选择缺失原因" style="width: 100%">
            <el-option label="委托方未提供" value="not-provided"></el-option>
            <el-option label="材料不完整" value="incomplete"></el-option>
            <el-option label="材料损坏无法使用" value="damaged"></el-option>
            <el-option label="需要补充新检材" value="need-additional"></el-option>
            <el-option label="其他原因" value="other"></el-option>
          </el-select>
        </div>

        <!-- 补充说明 -->
        <div class="additional-notes">
          <label class="form-label">
            <i class="fas fa-edit mr-1"></i>
            补充说明
          </label>
          <el-input
            v-model="missingMaterialForm.notes"
            type="textarea"
            :rows="4"
            placeholder="请详细说明缺失检材的具体情况、对鉴定的影响及建议..."
          />
        </div>

        <!-- 干系人通知 -->
        <div class="stakeholder-notification">
          <h4 class="section-title">
            <i class="fas fa-users text-green-600 mr-2"></i>
            通知干系人
          </h4>
          <div class="stakeholder-list">
            <el-checkbox-group v-model="missingMaterialForm.notifyStakeholders">
              <div class="stakeholder-item">
                <el-checkbox label="client">
                  <div class="stakeholder-info">
                    <span class="stakeholder-name">委托方</span>
                    <span class="stakeholder-desc">通知委托方补充缺失检材</span>
                  </div>
                </el-checkbox>
              </div>
              <div class="stakeholder-item">
                <el-checkbox label="lawyer">
                  <div class="stakeholder-info">
                    <span class="stakeholder-name">承办律师</span>
                    <span class="stakeholder-desc">通知律师协助收集材料</span>
                  </div>
                </el-checkbox>
              </div>
              <div class="stakeholder-item">
                <el-checkbox label="assistant">
                  <div class="stakeholder-info">
                    <span class="stakeholder-name">律师助理</span>
                    <span class="stakeholder-desc">通知助理跟进材料收集</span>
                  </div>
                </el-checkbox>
              </div>
              <div class="stakeholder-item">
                <el-checkbox label="case-manager">
                  <div class="stakeholder-info">
                    <span class="stakeholder-name">案件经理</span>
                    <span class="stakeholder-desc">通知案件经理协调处理</span>
                  </div>
                </el-checkbox>
              </div>
            </el-checkbox-group>
          </div>
        </div>

        <!-- 紧急程度 -->
        <div class="urgency-level">
          <label class="form-label">
            <i class="fas fa-clock mr-1"></i>
            紧急程度
          </label>
          <el-radio-group v-model="missingMaterialForm.urgency">
            <el-radio label="low">
              <el-tag type="info" size="small">一般</el-tag>
              <span class="ml-2">不影响鉴定进度</span>
            </el-radio>
            <el-radio label="medium">
              <el-tag type="warning" size="small">重要</el-tag>
              <span class="ml-2">可能影响鉴定结果</span>
            </el-radio>
            <el-radio label="high">
              <el-tag type="danger" size="small">紧急</el-tag>
              <span class="ml-2">严重影响鉴定进度</span>
            </el-radio>
          </el-radio-group>
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showMissingMaterialDialog = false">取消</el-button>
          <el-button type="primary" @click="submitMissingMaterials" :loading="submittingMissing">
            <i class="fas fa-paper-plane mr-2"></i>
            {{ submittingMissing ? '提交中...' : '确定并通知' }}
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 鉴定信息录入对话框 -->
    <el-dialog v-model="showAppraisalInputDialog" title="鉴定信息录入" width="900px" :close-on-click-modal="false">
      <div class="appraisal-input-content">
        <el-form :model="appraisalInputForm" :rules="appraisalInputRules" ref="appraisalInputFormRef" label-width="120px">
          <!-- 基本信息 -->
          <div class="form-section">
            <h3 class="section-title">
              <i class="fas fa-info-circle text-blue-600 mr-2"></i>
              基本信息
            </h3>
            <el-row :gutter="20">
              <el-col :span="12">
                <el-form-item label="案件编号" prop="caseNo">
                  <el-input v-model="appraisalInputForm.caseNo" readonly />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="案件名称" prop="caseName">
                  <el-input v-model="appraisalInputForm.caseName" readonly />
                </el-form-item>
              </el-col>
            </el-row>
          </div>

          <!-- 伤残预估信息 -->
          <div class="form-section">
            <h3 class="section-title">
              <i class="fas fa-user-injured text-orange-600 mr-2"></i>
              伤残预估信息
            </h3>
            <el-row :gutter="20">
              <el-col :span="12">
                <el-form-item label="预估伤残等级" prop="estimatedDisabilityLevel">
                  <el-select v-model="appraisalInputForm.estimatedDisabilityLevel" placeholder="请选择预估伤残等级" style="width: 100%">
                    <el-option label="一级伤残" value="1"></el-option>
                    <el-option label="二级伤残" value="2"></el-option>
                    <el-option label="三级伤残" value="3"></el-option>
                    <el-option label="四级伤残" value="4"></el-option>
                    <el-option label="五级伤残" value="5"></el-option>
                    <el-option label="六级伤残" value="6"></el-option>
                    <el-option label="七级伤残" value="7"></el-option>
                    <el-option label="八级伤残" value="8"></el-option>
                    <el-option label="九级伤残" value="9"></el-option>
                    <el-option label="十级伤残" value="10"></el-option>
                    <el-option label="无伤残" value="none"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="预估赔偿系数" prop="estimatedCompensationRatio">
                  <el-input v-model="appraisalInputForm.estimatedCompensationRatio" placeholder="如：100%" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="24">
                <el-form-item label="伤情描述" prop="injuryDescription">
                  <el-input 
                    v-model="appraisalInputForm.injuryDescription" 
                    type="textarea" 
                    :rows="3" 
                    placeholder="请详细描述伤情状况，包括受伤部位、严重程度等"
                  />
                </el-form-item>
              </el-col>
            </el-row>
          </div>

          <!-- 法医鉴定信息 -->
          <div class="form-section">
            <h3 class="section-title">
              <i class="fas fa-stethoscope text-green-600 mr-2"></i>
              法医鉴定信息
            </h3>
            <el-row :gutter="20">
              <el-col :span="12">
                <el-form-item label="鉴定机构" prop="appraisalInstitution">
                  <el-select v-model="appraisalInputForm.appraisalInstitution" placeholder="请选择鉴定机构" style="width: 100%">
                    <el-option label="北京市司法鉴定中心" value="beijing-judicial"></el-option>
                    <el-option label="中汽研汽车检验中心" value="catarc"></el-option>
                    <el-option label="市公安局法医鉴定中心" value="police-forensic"></el-option>
                    <el-option label="省司法鉴定协会" value="provincial-judicial"></el-option>
                    <el-option label="交通事故司法鉴定所" value="traffic-forensic"></el-option>
                    <el-option label="道路交通事故鉴定中心" value="road-traffic"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="鉴定类型" prop="appraisalType">
                  <el-select v-model="appraisalInputForm.appraisalType" placeholder="请选择鉴定类型" style="width: 100%">
                    <el-option label="司法鉴定" value="judicial"></el-option>
                    <el-option label="医疗鉴定" value="medical"></el-option>
                    <el-option label="工伤鉴定" value="injury"></el-option>
                    <el-option label="交通事故鉴定" value="traffic"></el-option>
                    <el-option label="其他鉴定" value="other"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="12">
                <el-form-item label="预约鉴定日期" prop="appointmentDate">
                  <el-date-picker
                    v-model="appraisalInputForm.appointmentDate"
                    type="date"
                    placeholder="选择鉴定日期"
                    style="width: 100%"
                    :disabled-date="disabledDate"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="预计费用" prop="estimatedCost">
                  <el-input v-model="appraisalInputForm.estimatedCost" placeholder="预计鉴定费用（元）">
                    <template #append>元</template>
                  </el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="24">
                <el-form-item label="鉴定说明" prop="appraisalNotes">
                  <el-input 
                    v-model="appraisalInputForm.appraisalNotes" 
                    type="textarea" 
                    :rows="3" 
                    placeholder="请输入鉴定相关说明、特殊要求等"
                  />
                </el-form-item>
              </el-col>
            </el-row>
          </div>

          <!-- 材料上传 -->
          <div class="form-section">
            <h3 class="section-title">
              <i class="fas fa-file-upload text-purple-600 mr-2"></i>
              鉴定材料上传
            </h3>
            <div class="material-upload-area">
              <el-upload
                ref="materialUploadRef"
                :action="materialUploadAction"
                :file-list="appraisalInputForm.materialFiles"
                :on-change="handleMaterialFileChange"
                :on-remove="handleMaterialFileRemove"
                :before-upload="beforeMaterialUpload"
                :auto-upload="false"
                multiple
                drag
                accept=".pdf,.doc,.docx,.jpg,.jpeg,.png,.zip,.rar"
              >
                <div class="upload-content">
                  <i class="fas fa-cloud-upload-alt upload-icon"></i>
                  <div class="upload-text">
                    <p>将文件拖到此处，或<em>点击上传</em></p>
                    <p class="upload-tip">支持 PDF、Word、图片、压缩包等格式</p>
                  </div>
                </div>
              </el-upload>
              
              <!-- 材料清单 -->
              <div class="material-checklist">
                <h4>鉴定所需材料清单：</h4>
                <el-row :gutter="20">
                  <el-col :span="12">
                    <el-checkbox-group v-model="appraisalInputForm.requiredMaterials">
                      <div class="checkbox-item">
                        <el-checkbox label="身份证复印件">身份证复印件</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="事故认定书">事故认定书</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="医疗诊断证明">医疗诊断证明</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="影像学检查报告">影像学检查报告</el-checkbox>
                      </div>
                    </el-checkbox-group>
                  </el-col>
                  <el-col :span="12">
                    <el-checkbox-group v-model="appraisalInputForm.requiredMaterials">
                      <div class="checkbox-item">
                        <el-checkbox label="病历资料">完整病历资料</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="费用清单">医疗费用清单</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="出院小结">出院小结</el-checkbox>
                      </div>
                      <div class="checkbox-item">
                        <el-checkbox label="其他材料">其他相关材料</el-checkbox>
                      </div>
                    </el-checkbox-group>
                  </el-col>
                </el-row>
              </div>
            </div>
          </div>
        </el-form>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showAppraisalInputDialog = false">取消</el-button>
          <el-button type="primary" @click="submitAppraisalInput" :loading="submitting">
            <i class="fas fa-save mr-2"></i>
            {{ submitting ? '保存中...' : '保存并进入鉴定中' }}
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 查看报告对话框 -->
    <el-dialog v-model="showReportDialog" title="鉴定报告详情" width="1000px" class="report-dialog">
      <div v-if="reportDetails.reportContent" class="report-content">
        <!-- 报告基本信息 -->
        <div class="report-header">
          <div class="report-title">
            <h2>司法鉴定意见书</h2>
            <div class="report-meta">
              <span class="report-no">报告编号：{{ reportDetails.reportContent.basicInfo.reportNo }}</span>
              <span class="report-date">出具日期：{{ reportDetails.reportContent.basicInfo.reportDate }}</span>
            </div>
          </div>
        </div>

        <!-- 基本信息表格 -->
        <div class="basic-info-section">
          <h3 class="section-title">基本信息</h3>
          <el-table :data="[reportDetails.reportContent.basicInfo]" border>
            <el-table-column prop="caseNo" label="案件编号" width="150"></el-table-column>
            <el-table-column prop="applicant" label="委托人" width="120"></el-table-column>
            <el-table-column prop="appraisalType" label="鉴定类型" width="120"></el-table-column>
            <el-table-column prop="institution" label="鉴定机构" width="200"></el-table-column>
            <el-table-column prop="appraisalPerson" label="鉴定人" width="120"></el-table-column>
          </el-table>
        </div>

        <!-- 鉴定结论 -->
        <div class="conclusion-section">
          <h3 class="section-title">鉴定结论</h3>
          <div class="conclusion-grid">
            <div class="conclusion-item" v-if="reportDetails.reportContent.appraisalConclusion.disabilityLevel !== '不适用'">
              <label>伤残等级：</label>
              <span class="conclusion-value disability">{{ reportDetails.reportContent.appraisalConclusion.disabilityLevel }}</span>
            </div>
            <div class="conclusion-item" v-if="reportDetails.reportContent.appraisalConclusion.compensationRatio !== '不适用'">
              <label>责任比例：</label>
              <span class="conclusion-value ratio">{{ reportDetails.reportContent.appraisalConclusion.compensationRatio }}</span>
            </div>
            <div class="conclusion-item" v-if="reportDetails.reportContent.appraisalConclusion.injuryDegree !== '不适用'">
              <label>伤情程度：</label>
              <span class="conclusion-value injury">{{ reportDetails.reportContent.appraisalConclusion.injuryDegree }}</span>
            </div>
            <div class="conclusion-item" v-if="reportDetails.reportContent.appraisalConclusion.mentalCondition !== '不适用'">
              <label>精神状态：</label>
              <span class="conclusion-value mental">{{ reportDetails.reportContent.appraisalConclusion.mentalCondition }}</span>
            </div>
          </div>
        </div>

        <!-- 分析过程 -->
        <div class="analysis-section">
          <h3 class="section-title">分析过程</h3>
          <div class="analysis-steps">
            <div class="analysis-step">
              <div class="step-title">
                <i class="fas fa-file-medical"></i>
                材料审查
              </div>
              <div class="step-content">{{ reportDetails.reportContent.analysisProcess.materialReview }}</div>
            </div>
            <div class="analysis-step">
              <div class="step-title">
                <i class="fas fa-user-md"></i>
                临床检查
              </div>
              <div class="step-content">{{ reportDetails.reportContent.analysisProcess.clinicalExamination }}</div>
            </div>
            <div class="analysis-step">
              <div class="step-title">
                <i class="fas fa-chart-line"></i>
                证据分析
              </div>
              <div class="step-content">{{ reportDetails.reportContent.analysisProcess.evidenceAnalysis }}</div>
            </div>
          </div>
        </div>

        <!-- 鉴定意见 -->
        <div class="opinion-section">
          <h3 class="section-title">鉴定意见</h3>
          <ul class="opinion-list">
            <li v-for="(conclusion, index) in reportDetails.reportContent.conclusions" :key="index">
              {{ conclusion }}
            </li>
          </ul>
        </div>

        <!-- 相关文件 -->
        <div class="files-section">
          <h3 class="section-title">相关文件</h3>
          <div class="file-list">
            <div v-for="file in reportDetails.reportFiles" :key="file.name" class="file-item">
              <div class="file-info">
                <i :class="`fas ${file.type === 'pdf' ? 'fa-file-pdf' : 'fa-file-image'}`" 
                   :style="{ color: file.type === 'pdf' ? '#f56565' : '#48bb78' }"></i>
                <div class="file-details">
                  <div class="file-name">{{ file.name }}</div>
                  <div class="file-size">{{ file.size }}</div>
                </div>
              </div>
              <div class="file-actions">
                <el-button size="small" type="primary" @click="downloadFile(file)">
                  <i class="fas fa-download"></i>
                  下载
                </el-button>
                <el-button size="small" @click="previewFile(file)">
                  <i class="fas fa-eye"></i>
                  预览
                </el-button>
              </div>
            </div>
          </div>
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showReportDialog = false">关闭</el-button>
          <el-button type="success" @click="printReport(reportDetails)">
            <i class="fas fa-print mr-2"></i>
            打印报告
          </el-button>
          <el-button type="primary" @click="exportReport(reportDetails)">
            <i class="fas fa-download mr-2"></i>
            导出PDF
          </el-button>
        </div>
      </template>
    </el-dialog>

    <!-- 打印材料对话框 -->
    <el-dialog v-model="showPrintDialog" title="打印材料选择" width="600px">
      <div class="print-material-selection">
        <!-- 案件信息 -->
        <div class="case-info" v-if="currentAppraisal">
          <h4>案件信息</h4>
          <div class="info-row">
            <span class="label">案件编号：</span>
            <span class="value">{{ currentAppraisal.caseNo }}</span>
          </div>
          <div class="info-row">
            <span class="label">委托人：</span>
            <span class="value">{{ currentAppraisal.clientName }}</span>
          </div>
          <div class="info-row">
            <span class="label">鉴定类型：</span>
            <span class="value">{{ getTypeName(currentAppraisal.type) }}</span>
          </div>
        </div>

        <!-- 材料选择 -->
        <div class="material-selection">
          <h4>选择要打印的材料</h4>
          <div class="material-grid">
            <div class="material-category">
              <el-checkbox v-model="printSelection.reportFile" size="large">
                <div class="category-content">
                  <i class="fas fa-file-pdf category-icon"></i>
                  <div class="category-info">
                    <div class="category-title">鉴定报告</div>
                    <div class="category-desc">司法鉴定意见书、检验报告等</div>
                  </div>
                </div>
              </el-checkbox>
            </div>

            <div class="material-category">
              <el-checkbox v-model="printSelection.evidenceFiles" size="large">
                <div class="category-content">
                  <i class="fas fa-images category-icon"></i>
                  <div class="category-info">
                    <div class="category-title">证据材料</div>
                    <div class="category-desc">影像资料、检验照片等</div>
                  </div>
                </div>
              </el-checkbox>
            </div>

            <div class="material-category">
              <el-checkbox v-model="printSelection.caseFiles" size="large">
                <div class="category-content">
                  <i class="fas fa-folder-open category-icon"></i>
                  <div class="category-info">
                    <div class="category-title">案件文档</div>
                    <div class="category-desc">委托书、病历资料等</div>
                  </div>
                </div>
              </el-checkbox>
            </div>

            <div class="material-category">
              <el-checkbox v-model="printSelection.personalInfo" size="large">
                <div class="category-content">
                  <i class="fas fa-user-shield category-icon"></i>
                  <div class="category-info">
                    <div class="category-title">身份信息</div>
                    <div class="category-desc">身份证、户籍等个人信息</div>
                  </div>
                </div>
              </el-checkbox>
            </div>
          </div>
        </div>

        <!-- 打印选项 -->
        <div class="print-options">
          <h4>打印选项</h4>
          <div class="option-row">
            <el-radio-group v-model="printSettings.format" size="large">
              <el-radio label="pdf">生成PDF文件</el-radio>
              <el-radio label="direct">直接打印</el-radio>
            </el-radio-group>
          </div>
          <div class="option-row" v-if="printSettings.format === 'pdf'">
            <el-checkbox v-model="printSettings.includeWatermark">添加水印</el-checkbox>
            <el-checkbox v-model="printSettings.includePageNumbers">添加页码</el-checkbox>
          </div>
        </div>

        <!-- 材料清单预览 -->
        <div class="material-preview" v-if="selectedMaterialsCount > 0">
          <h4>将要打印的材料 ({{ selectedMaterialsCount }} 类)</h4>
          <div class="preview-list">
            <div v-if="printSelection.reportFile" class="preview-item">
              <i class="fas fa-file-pdf"></i>
              <span>鉴定报告 (3个文件)</span>
              <el-tag size="small" type="success">PDF</el-tag>
            </div>
            <div v-if="printSelection.evidenceFiles" class="preview-item">
              <i class="fas fa-images"></i>
              <span>证据材料 (5个文件)</span>
              <el-tag size="small" type="info">图片</el-tag>
            </div>
            <div v-if="printSelection.caseFiles" class="preview-item">
              <i class="fas fa-folder-open"></i>
              <span>案件文档 (2个文件)</span>
              <el-tag size="small" type="warning">文档</el-tag>
            </div>
            <div v-if="printSelection.personalInfo" class="preview-item">
              <i class="fas fa-user-shield"></i>
              <span>身份信息 (1个文件)</span>
              <el-tag size="small">PDF</el-tag>
            </div>
          </div>
        </div>
      </div>

      <template #footer>
        <div class="dialog-footer">
          <el-button @click="showPrintDialog = false">取消</el-button>
          <el-button type="primary" @click="confirmPrintMaterials" :disabled="selectedMaterialsCount === 0">
            <i class="fas fa-print mr-2"></i>
            {{ printSettings.format === 'pdf' ? '生成PDF' : '开始打印' }}
          </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { ref, reactive, computed } from 'vue'
import { useRouter } from 'vue-router'
import dayjs from 'dayjs'
import { ElMessage, ElMessageBox } from 'element-plus'

export default {
  name: 'AppraisalManagement',
  setup() {
    const router = useRouter()
    
    // 响应式数据
    const loading = ref(false)
    const searchKeyword = ref('')
    const currentPage = ref(1)
    const pageSize = ref(10)
    const activeTab = ref('pending')
    const showAddDialog = ref(false)
    const showUploadDialog = ref(false)
    const showScheduleDialog = ref(false)
    const showMaterialDialog = ref(false)
    const showRemarkDialog = ref(false)
    const uploading = ref(false)
    const currentAppraisal = ref(null)
    const uploadedFiles = ref([])
    const uploadRef = ref(null)
    const selectedCases = ref([])
    const selectedDate = ref(new Date())
    const selectedPendingCases = ref([])
    const materialFiles = ref([])
    
    // 鉴定信息录入相关
    const showAppraisalInputDialog = ref(false)
    const submitting = ref(false)
    const materialUploadRef = ref(null)
    const materialUploadAction = ref('/api/upload/materials')
    const appraisalInputFormRef = ref(null)
    
    // 缺少检材相关
    const showMissingMaterialDialog = ref(false)
    const submittingMissing = ref(false)
    
    // 查看报告相关
    const showReportDialog = ref(false)
    const reportDetails = ref({})
    
    // 打印材料相关
    const showPrintDialog = ref(false)
    const printSelection = ref({
      reportFile: true,
      evidenceFiles: true,
      caseFiles: true,
      personalInfo: false
    })
    const printSettings = ref({
      format: 'pdf',
      includeWatermark: true,
      includePageNumbers: true
    })
    
    const filters = reactive({
      stages: [],
      type: '',
      institution: ''
    })
    
    const newAppraisal = reactive({
      caseTitle: '',
      type: '',
      institution: '',
      cost: '',
      description: ''
    })
    
    const reportForm = reactive({
      description: '',
      reportTypes: []
    })
    
    const materialForm = reactive({
      checkedMaterials: [],
      remark: ''
    })
    
    const remarkForm = reactive({
      time: new Date(),
      content: '',
      type: ''
    })
    
    // 缺少检材表单
    const missingMaterialForm = reactive({
      selectedSpecimens: [],
      reason: '',
      notes: '',
      notifyStakeholders: ['client'],
      urgency: 'medium'
    })
    
    // 检材列表
    const specimenList = ref([
      {
        id: 'blood-sample',
        name: '血液样本',
        description: '用于DNA检测、酒精含量检测等',
        urgent: false
      },
      {
        id: 'tissue-sample', 
        name: '组织样本',
        description: '病理检查所需组织切片',
        urgent: true
      },
      {
        id: 'x-ray-films',
        name: 'X光片',
        description: '骨折、内伤诊断影像资料',
        urgent: false
      },
      {
        id: 'ct-scan',
        name: 'CT扫描',
        description: '头部、胸腹部等CT影像',
        urgent: true
      },
      {
        id: 'mri-images',
        name: 'MRI影像',
        description: '软组织、神经系统检查',
        urgent: false
      },
      {
        id: 'vehicle-parts',
        name: '车辆部件',
        description: '事故车辆关键部件检材',
        urgent: false
      },
      {
        id: 'fiber-evidence',
        name: '纤维证据',
        description: '衣物纤维、碰撞痕迹物证',
        urgent: false
      },
      {
        id: 'dna-sample',
        name: 'DNA样本',
        description: '亲子鉴定、身份识别样本',
        urgent: true
      }
    ])

    // 鉴定信息录入表单
    const appraisalInputForm = reactive({
      caseNo: '',
      caseName: '',
      estimatedDisabilityLevel: '',
      estimatedCompensationRatio: '',
      injuryDescription: '',
      appraisalInstitution: '',
      appraisalType: '',
      appointmentDate: null,
      estimatedCost: '',
      appraisalNotes: '',
      materialFiles: [],
      requiredMaterials: []
    })

    // 鉴定录入表单验证规则
    const appraisalInputRules = reactive({
      estimatedDisabilityLevel: [
        { required: true, message: '请选择预估伤残等级', trigger: 'change' }
      ],
      injuryDescription: [
        { required: true, message: '请输入伤情描述', trigger: 'blur' },
        { min: 10, message: '伤情描述至少10个字符', trigger: 'blur' }
      ],
      appraisalInstitution: [
        { required: true, message: '请选择鉴定机构', trigger: 'change' }
      ],
      appraisalType: [
        { required: true, message: '请选择鉴定类型', trigger: 'change' }
      ],
      appointmentDate: [
        { required: true, message: '请选择预约鉴定日期', trigger: 'change' }
      ]
    })
    
    // 模拟鉴定数据 - 交通事故相关
    const appraisals = ref([
      {
        id: 1,
        appraisalNo: 'JD-2024-001',
        caseTitle: '机动车追尾事故伤残鉴定',
        type: 'traffic',
        stage: 'litigation',
        institution: '北京市司法鉴定中心',
        status: 'completed',
        estimatedDate: '2024-01-15',
        scheduledDate: '2024-01-10',
        cost: 3500,
        description: '追尾事故致颈椎、腰椎损伤，鉴定为九级伤残',
        reportStatus: 'uploaded',
        materialStatus: 'complete',
        compensationRatio: 60
      },
      {
        id: 2,
        appraisalNo: 'JD-2024-002',
        caseTitle: '交通事故车辆损失评估',
        type: 'property',
        stage: 'pre-litigation',
        institution: '中汽研汽车检验中心',
        status: 'in-progress',
        estimatedDate: '2024-02-20',
        scheduledDate: '2024-02-15',
        cost: 2800,
        description: '豪华轿车碰撞损失评估，含维修费用及贬值损失',
        reportStatus: null,
        materialStatus: 'complete',
        compensationRatio: null
      },
      {
        id: 3,
        appraisalNo: 'JD-2024-003',
        caseTitle: '行人交通事故死亡原因鉴定',
        type: 'traffic',
        stage: 'litigation',
        institution: '市公安局法医鉴定中心',
        status: 'completed',
        estimatedDate: '2024-01-30',
        scheduledDate: '2024-01-25',
        cost: 4500,
        description: '行人被撞致死，鉴定死亡原因与交通事故的因果关系',
        reportStatus: 'uploaded',
        materialStatus: 'complete',
        compensationRatio: 100
      },
      {
        id: 4,
        appraisalNo: 'JD-2024-004',
        caseTitle: '电动车事故伤残程度鉴定',
        type: 'traffic',
        stage: 'mediation',
        institution: '省司法鉴定协会',
        status: 'pending',
        estimatedDate: '2024-02-25',
        scheduledDate: null,
        cost: 3200,
        description: '电动车与机动车碰撞致多处骨折，待鉴定伤残等级',
        reportStatus: null,
        materialStatus: 'incomplete',
        compensationRatio: null,
        schedule: '9月5日'
      },
      {
        id: 5,
        appraisalNo: 'JD-2024-005',
        caseTitle: '酒驾事故车速检测',
        type: 'technical',
        stage: 'litigation',
        institution: '交通事故司法鉴定所',
        status: 'in-progress',
        estimatedDate: '2024-02-18',
        scheduledDate: '2024-02-12',
        cost: 5500,
        description: '通过车辆痕迹、监控视频等证据鉴定事故发生时车速',
        reportStatus: null,
        materialStatus: 'complete',
        compensationRatio: null
      },
      {
        id: 6,
        appraisalNo: 'JD-2024-006',
        caseTitle: '大货车侧翻事故责任鉴定',
        type: 'traffic',
        stage: 'pre-litigation',
        institution: '道路交通事故鉴定中心',
        status: 'pending',
        estimatedDate: '2024-03-01',
        scheduledDate: null,
        cost: 6800,
        description: '分析货车超载、路况、天气等因素对事故的影响程度',
        reportStatus: null,
        materialStatus: 'incomplete',
        compensationRatio: null,
        schedule: null
      },
      {
        id: 7,
        appraisalNo: 'JD-2024-007',
        caseTitle: '摩托车与轿车碰撞伤残鉴定',
        type: 'traffic',
        stage: 'mediation',
        institution: '省司法鉴定协会',
        status: 'completed',
        estimatedDate: '2024-01-20',
        scheduledDate: '2024-01-18',
        cost: 3800,
        description: '摩托车驾驶员头部外伤，鉴定为八级伤残',
        reportStatus: 'uploaded',
        materialStatus: 'complete',
        compensationRatio: 75
      },
      {
        id: 8,
        appraisalNo: 'JD-2024-008',
        caseTitle: '工程车辆倾覆事故鉴定',
        type: 'technical',
        stage: 'litigation',
        institution: '交通事故司法鉴定所',
        status: 'pending',
        estimatedDate: '2024-03-05',
        scheduledDate: null,
        cost: 7200,
        description: '工程车辆在作业过程中发生倾覆，需鉴定事故原因',
        reportStatus: null,
        materialStatus: 'incomplete',
        compensationRatio: null,
        schedule: '9月12日'
      }
    ])
    
    // 必需材料清单
    const requiredMaterials = ref([
      { id: 'medical_record', name: '病历资料', required: true, completed: true },
      { id: 'accident_report', name: '交通事故认定书', required: true, completed: true },
      { id: 'id_card', name: '身份证复印件', required: true, completed: true },
      { id: 'medical_invoice', name: '医疗费发票', required: true, completed: false },
      { id: 'disability_cert', name: '残疾证明', required: false, completed: false },
      { id: 'income_proof', name: '收入证明', required: false, completed: false },
      { id: 'witness_statement', name: '证人证言', required: false, completed: true },
      { id: 'scene_photos', name: '现场照片', required: true, completed: true },
      { id: 'vehicle_damage', name: '车辆损失证明', required: false, completed: false }
    ])
    
    // 计算属性
    const filteredAppraisals = computed(() => {
      let result = appraisals.value
      
      // 按页签过滤
      result = result.filter(item => item.status === activeTab.value)
      
      if (searchKeyword.value) {
        const keyword = searchKeyword.value.toLowerCase()
        result = result.filter(item =>
          item.appraisalNo.toLowerCase().includes(keyword) ||
          item.caseTitle.toLowerCase().includes(keyword)
        )
      }
      
      // 按案件阶段过滤
      if (filters.stages.length > 0) {
        result = result.filter(item => filters.stages.includes(item.stage))
      }
      
      if (filters.type) {
        result = result.filter(item => item.type === filters.type)
      }
      
      if (filters.institution) {
        result = result.filter(item => {
          const institutionMap = {
            'beijing-judicial': '北京市司法鉴定中心',
            'catarc': '中汽研汽车检验中心',
            'police-forensic': '市公安局法医鉴定中心',
            'provincial-judicial': '省司法鉴定协会',
            'traffic-forensic': '交通事故司法鉴定所',
            'road-traffic': '道路交通事故鉴定中心'
          }
          return item.institution === institutionMap[filters.institution]
        })
      }
      
      return result
    })
    
    const totalAppraisals = computed(() => appraisals.value.length)
    const pendingAppraisals = computed(() => appraisals.value.filter(a => a.status === 'pending').length)
    const inProgressAppraisals = computed(() => appraisals.value.filter(a => a.status === 'in-progress').length)
    const completedAppraisals = computed(() => appraisals.value.filter(a => a.status === 'completed').length)
    const urgentAppraisals = computed(() => appraisals.value.filter(a => a.status === 'pending' && new Date(a.estimatedDate) < new Date(Date.now() + 7 * 24 * 60 * 60 * 1000)).length)
    
    // 排期相关计算属性
    const selectedDateCases = computed(() => {
      const dateStr = dayjs(selectedDate.value).format('YYYY-MM-DD')
      return appraisals.value.filter(item => item.scheduledDate === dateStr)
    })
    
    const pendingScheduleCases = computed(() => {
      return appraisals.value.filter(item => item.status === 'pending' && !item.scheduledDate)
    })
    
    // 方法
    const refreshData = () => {
      ElMessage.success('数据已刷新')
    }
    
    const applyFilters = () => {
      currentPage.value = 1
    }
    
    const clearFilters = () => {
      Object.assign(filters, {
        stages: [],
        type: '',
        institution: ''
      })
      searchKeyword.value = ''
      currentPage.value = 1
    }
    
    // 页签切换
    const handleTabChange = (tab) => {
      activeTab.value = tab
      selectedCases.value = []
      currentPage.value = 1
    }
    
    // 选择相关方法
    const handleSelectionChange = (selection) => {
      selectedCases.value = selection
    }
    
    const isSelectable = (row) => {
      // 只有待鉴定和鉴定中的案件可以选择
      return row.status !== 'completed'
    }
    
    const clearSelection = () => {
      selectedCases.value = []
    }
    
    // 批量预约
    const batchSchedule = () => {
      showScheduleDialog.value = true
    }
    
    // 排期管理相关方法
    const handleDateChange = () => {
      // 日历面板变化时的处理
    }
    
    const getScheduleCount = (date) => {
      return appraisals.value.filter(item => item.scheduledDate === date).length
    }
    
    const handlePendingSelectionChange = (selection) => {
      selectedPendingCases.value = selection
    }
    
    const confirmSchedule = () => {
      if (selectedPendingCases.value.length === 0) {
        ElMessage.warning('请选择要安排的案件')
        return
      }
      
      const dateStr = dayjs(selectedDate.value).format('YYYY-MM-DD')
      selectedPendingCases.value.forEach(caseItem => {
        const appraisal = appraisals.value.find(a => a.id === caseItem.id)
        if (appraisal) {
          appraisal.scheduledDate = dateStr
        }
      })
      
      ElMessage.success(`成功安排 ${selectedPendingCases.value.length} 个案件到 ${dateStr}`)
      showScheduleDialog.value = false
      selectedPendingCases.value = []
    }
    
    const viewAppraisal = (appraisal) => {
      router.push(`/lawyer/appraisal/${appraisal.id}`)
    }
    
    const editAppraisal = (appraisal) => {
      router.push(`/lawyer/appraisal/${appraisal.id}/edit`)
    }
    
    // 开始鉴定
    const startAppraisal = (appraisal) => {
      if (appraisal.materialStatus === 'incomplete') {
        ElMessage.warning('材料未齐全，请先补充材料')
        manageMaterials(appraisal)
        return
      }
      
      appraisal.status = 'in-progress'
      ElMessage.success('已开始鉴定')
    }
    
    // 材料管理
    const manageMaterials = (appraisal) => {
      currentAppraisal.value = appraisal
      showMaterialDialog.value = true
      resetMaterialForm()
    }
    
    const resetMaterialForm = () => {
      materialFiles.value = []
      Object.assign(materialForm, {
        checkedMaterials: [],
        remark: ''
      })
    }
    
    // 缺少检材管理
    const manageMissingMaterials = (appraisal) => {
      currentAppraisal.value = appraisal
      showMissingMaterialDialog.value = true
      resetMissingMaterialForm()
    }
    
    const resetMissingMaterialForm = () => {
      Object.assign(missingMaterialForm, {
        selectedSpecimens: [],
        reason: '',
        notes: '',
        notifyStakeholders: ['client'],
        urgency: 'medium'
      })
    }
    
    // 提交缺少检材信息
    const submitMissingMaterials = async () => {
      if (missingMaterialForm.selectedSpecimens.length === 0) {
        ElMessage.warning('请选择缺失的检材')
        return
      }
      
      if (!missingMaterialForm.reason) {
        ElMessage.warning('请选择缺失原因')
        return
      }
      
      if (missingMaterialForm.notifyStakeholders.length === 0) {
        ElMessage.warning('请选择要通知的干系人')
        return
      }
      
      try {
        submittingMissing.value = true
        
        // 模拟提交过程
        await new Promise(resolve => setTimeout(resolve, 1500))
        
        // 记录缺失检材信息
        const missingRecord = {
          id: Date.now(),
          appraisalId: currentAppraisal.value.id,
          specimens: missingMaterialForm.selectedSpecimens.map(id => 
            specimenList.value.find(s => s.id === id)
          ),
          reason: missingMaterialForm.reason,
          notes: missingMaterialForm.notes,
          notifiedStakeholders: missingMaterialForm.notifyStakeholders,
          urgency: missingMaterialForm.urgency,
          reportTime: new Date().toISOString(),
          status: 'pending'
        }
        
        // 更新案件状态
        const appraisal = appraisals.value.find(a => a.id === currentAppraisal.value.id)
        if (appraisal) {
          appraisal.materialStatus = 'incomplete'
          if (!appraisal.missingMaterials) {
            appraisal.missingMaterials = []
          }
          appraisal.missingMaterials.push(missingRecord)
        }
        
        // 发送通知给相关干系人
        await sendNotificationToStakeholders(missingRecord)
        
        ElMessage.success('缺失检材信息已提交，相关干系人已收到通知')
        showMissingMaterialDialog.value = false
        
      } catch (error) {
        ElMessage.error('提交失败，请重试')
        console.error('Submit missing materials error:', error)
      } finally {
        submittingMissing.value = false
      }
    }
    
    // 发送通知给干系人
    const sendNotificationToStakeholders = async (missingRecord) => {
      const stakeholderNames = {
        'client': '委托方',
        'lawyer': '承办律师', 
        'assistant': '律师助理',
        'case-manager': '案件经理'
      }
      
      const urgencyText = {
        'low': '一般',
        'medium': '重要',
        'high': '紧急'
      }
      
      const specimenNames = missingRecord.specimens.map(s => s.name).join('、')
      
      // 模拟发送通知
      for (const stakeholder of missingRecord.notifiedStakeholders) {
        console.log(`通知${stakeholderNames[stakeholder]}：案件${currentAppraisal.value.caseTitle}缺少检材：${specimenNames}，紧急程度：${urgencyText[missingRecord.urgency]}`)
      }
      
      // 这里应该调用实际的通知API
      return new Promise(resolve => setTimeout(resolve, 500))
    }
    
    // 添加备注
    const addRemark = (appraisal) => {
      currentAppraisal.value = appraisal
      showRemarkDialog.value = true
      Object.assign(remarkForm, {
        time: new Date(),
        content: '',
        type: ''
      })
    }
    
    // 生成报告内容
    const generateReportContent = (appraisal) => {
      return {
        basicInfo: {
          reportNo: `${appraisal.caseNo}-RP-${Date.now().toString().slice(-6)}`,
          reportDate: dayjs().format('YYYY年MM月DD日'),
          institution: appraisal.institution || '北京市司法鉴定中心',
          appraisalType: getTypeName(appraisal.type),
          caseNo: appraisal.caseNo,
          applicant: appraisal.clientName,
          appraisalPerson: '张主任医师'
        },
        appraisalConclusion: {
          disabilityLevel: appraisal.type === 'disability' ? '九级伤残' : '不适用',
          compensationRatio: appraisal.type === 'liability' ? '70%' : '不适用',
          injuryDegree: appraisal.type === 'injury' ? '轻微伤' : '不适用',
          mentalCondition: appraisal.type === 'mental' ? '轻度抑郁状态' : '不适用'
        },
        analysisProcess: {
          materialReview: '已审查相关病历资料、影像学检查报告、法医学检验报告等材料',
          clinicalExamination: '进行了详细的临床检查，包括体格检查、功能评估等',
          evidenceAnalysis: '结合相关医学文献和鉴定标准进行综合分析'
        },
        conclusions: [
          '根据现有材料和检查结果，被鉴定人符合相应鉴定标准',
          '鉴定意见具有科学性和客观性',
          '建议结合具体情况进行后续处理'
        ]
      }
    }
    
    // 查看报告
    const viewReport = (appraisal) => {
      currentAppraisal.value = appraisal
      // 获取报告详情
      reportDetails.value = {
        ...appraisal,
        reportContent: generateReportContent(appraisal),
        reportFiles: [
          { name: '司法鉴定意见书.pdf', url: '#', size: '2.1MB', type: 'pdf' },
          { name: '鉴定检验报告.pdf', url: '#', size: '1.5MB', type: 'pdf' },
          { name: '影像资料分析.jpg', url: '#', size: '800KB', type: 'image' }
        ]
      }
      showReportDialog.value = true
    }
    
    // 文件操作函数
    const downloadFile = (file) => {
      // 创建临时下载链接
      const link = document.createElement('a')
      link.href = file.url
      link.download = file.name
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
      ElMessage.success(`开始下载 ${file.name}`)
    }
    
    const previewFile = (file) => {
      if (file.type === 'pdf') {
        window.open(file.url, '_blank')
      } else {
        ElMessage.info(`预览 ${file.name}`)
      }
    }
    
    const printReport = (reportData) => {
      // 生成打印页面
      const printContent = generatePrintContent(reportData)
      const printWindow = window.open('', '_blank')
      printWindow.document.write(printContent)
      printWindow.document.close()
      printWindow.print()
      ElMessage.success('已发送到打印机')
    }
    
    const exportReport = (reportData) => {
      ElMessage.success('正在生成PDF文件...')
      // 模拟PDF导出
      setTimeout(() => {
        ElMessage.success('PDF文件已生成并开始下载')
      }, 2000)
    }
    
    // 生成打印内容
    const generatePrintContent = (reportData) => {
      const content = reportData.reportContent
      return `
        <!DOCTYPE html>
        <html>
        <head>
          <title>司法鉴定意见书 - ${content.basicInfo.reportNo}</title>
          <style>
            @media print {
              body { margin: 0; padding: 20px; font-family: '微软雅黑', Arial, sans-serif; }
              .page-break { page-break-before: always; }
              .no-print { display: none; }
            }
            body { font-family: '微软雅黑', Arial, sans-serif; line-height: 1.6; color: #333; }
            .header { text-align: center; margin-bottom: 30px; border-bottom: 2px solid #333; padding-bottom: 15px; }
            .header h1 { margin: 0; font-size: 24px; font-weight: bold; }
            .meta-info { margin-top: 10px; font-size: 14px; }
            .section { margin: 20px 0; }
            .section-title { font-size: 16px; font-weight: bold; margin-bottom: 10px; color: #2c3e50; border-left: 4px solid #3498db; padding-left: 10px; }
            .info-table { width: 100%; border-collapse: collapse; margin: 15px 0; }
            .info-table td { padding: 8px 12px; border: 1px solid #ddd; }
            .info-table td:first-child { background-color: #f8f9fa; font-weight: bold; width: 120px; }
            .conclusion-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin: 15px 0; }
            .conclusion-item { padding: 10px; border: 1px solid #e9ecef; border-radius: 4px; }
            .conclusion-item label { font-weight: bold; color: #495057; }
            .conclusion-value { color: #e74c3c; font-weight: bold; }
            .analysis-step { margin: 15px 0; padding: 15px; background-color: #f8f9fa; border-radius: 4px; }
            .step-title { font-weight: bold; margin-bottom: 8px; color: #2c3e50; }
            .opinion-list { margin: 15px 0; padding-left: 20px; }
            .opinion-list li { margin: 8px 0; }
            .signature-area { margin-top: 40px; text-align: right; }
            .signature-line { margin: 20px 0; border-bottom: 1px solid #333; width: 200px; margin-left: auto; }
          </style>
        </head>
        <body>
          <div class="header">
            <h1>司法鉴定意见书</h1>
            <div class="meta-info">
              <span>报告编号：${content.basicInfo.reportNo}</span>
              <span style="margin-left: 40px;">出具日期：${content.basicInfo.reportDate}</span>
            </div>
          </div>

          <div class="section">
            <div class="section-title">基本信息</div>
            <table class="info-table">
              <tr><td>案件编号</td><td>${content.basicInfo.caseNo}</td></tr>
              <tr><td>委托人</td><td>${content.basicInfo.applicant}</td></tr>
              <tr><td>鉴定类型</td><td>${content.basicInfo.appraisalType}</td></tr>
              <tr><td>鉴定机构</td><td>${content.basicInfo.institution}</td></tr>
              <tr><td>鉴定人</td><td>${content.basicInfo.appraisalPerson}</td></tr>
            </table>
          </div>

          <div class="section">
            <div class="section-title">鉴定结论</div>
            <div class="conclusion-grid">
              ${content.appraisalConclusion.disabilityLevel !== '不适用' ? 
                `<div class="conclusion-item"><label>伤残等级：</label><span class="conclusion-value">${content.appraisalConclusion.disabilityLevel}</span></div>` : ''}
              ${content.appraisalConclusion.compensationRatio !== '不适用' ? 
                `<div class="conclusion-item"><label>责任比例：</label><span class="conclusion-value">${content.appraisalConclusion.compensationRatio}</span></div>` : ''}
              ${content.appraisalConclusion.injuryDegree !== '不适用' ? 
                `<div class="conclusion-item"><label>伤情程度：</label><span class="conclusion-value">${content.appraisalConclusion.injuryDegree}</span></div>` : ''}
              ${content.appraisalConclusion.mentalCondition !== '不适用' ? 
                `<div class="conclusion-item"><label>精神状态：</label><span class="conclusion-value">${content.appraisalConclusion.mentalCondition}</span></div>` : ''}
            </div>
          </div>

          <div class="section">
            <div class="section-title">分析过程</div>
            <div class="analysis-step">
              <div class="step-title">材料审查</div>
              <div>${content.analysisProcess.materialReview}</div>
            </div>
            <div class="analysis-step">
              <div class="step-title">临床检查</div>
              <div>${content.analysisProcess.clinicalExamination}</div>
            </div>
            <div class="analysis-step">
              <div class="step-title">证据分析</div>
              <div>${content.analysisProcess.evidenceAnalysis}</div>
            </div>
          </div>

          <div class="section">
            <div class="section-title">鉴定意见</div>
            <ul class="opinion-list">
              ${content.conclusions.map(conclusion => `<li>${conclusion}</li>`).join('')}
            </ul>
          </div>

          <div class="signature-area">
            <div>鉴定机构：${content.basicInfo.institution}</div>
            <div class="signature-line"></div>
            <div style="margin-top: 10px;">鉴定人：${content.basicInfo.appraisalPerson}</div>
            <div class="signature-line"></div>
            <div style="margin-top: 10px;">日期：${content.basicInfo.reportDate}</div>
          </div>
        </body>
        </html>
      `
    }
    
    // 选中材料数量计算属性
    const selectedMaterialsCount = computed(() => {
      let count = 0
      if (printSelection.value.reportFile) count++
      if (printSelection.value.evidenceFiles) count++
      if (printSelection.value.caseFiles) count++
      if (printSelection.value.personalInfo) count++
      return count
    })
    
    // 确认打印材料
    const confirmPrintMaterials = async () => {
      const selectedTypes = []
      if (printSelection.value.reportFile) selectedTypes.push('鉴定报告')
      if (printSelection.value.evidenceFiles) selectedTypes.push('证据材料')
      if (printSelection.value.caseFiles) selectedTypes.push('案件文档')
      if (printSelection.value.personalInfo) selectedTypes.push('身份信息')
      
      if (printSettings.value.format === 'pdf') {
        ElMessage.loading('正在生成PDF文件...', { duration: 0 })
        
        // 模拟PDF生成过程
        setTimeout(() => {
          ElMessage.closeAll()
          ElMessage.success(`已生成包含${selectedTypes.join('、')}的PDF文件`)
          showPrintDialog.value = false
        }, 3000)
      } else {
        ElMessage.loading('正在发送到打印机...', { duration: 0 })
        
        // 模拟打印过程
        setTimeout(() => {
          ElMessage.closeAll()
          ElMessage.success(`已发送${selectedTypes.join('、')}到打印机`)
          showPrintDialog.value = false
        }, 2000)
      }
    }
    
    // 打印材料功能
    const printMaterials = (appraisal) => {
      currentAppraisal.value = appraisal
      // 重置选择状态
      printSelection.value = {
        reportFile: true,
        evidenceFiles: true,
        caseFiles: true,
        personalInfo: false
      }
      showPrintDialog.value = true
    }
    
    const deleteAppraisal = async (appraisal) => {
      try {
        await ElMessageBox.confirm('确定要删除这个鉴定申请吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        
        const index = appraisals.value.findIndex(a => a.id === appraisal.id)
        if (index > -1) {
          appraisals.value.splice(index, 1)
          ElMessage.success('删除成功')
        }
      } catch (error) {
        if (error !== 'cancel') {
          ElMessage.error('删除失败')
        }
      }
    }
    
    const addAppraisal = () => {
      if (!newAppraisal.caseTitle || !newAppraisal.type) {
        ElMessage.error('请填写必填字段')
        return
      }
      
      const id = Math.max(...appraisals.value.map(a => a.id)) + 1
      appraisals.value.unshift({
        id,
        appraisalNo: `JD-2024-${String(id).padStart(3, '0')}`,
        caseTitle: newAppraisal.caseTitle,
        type: newAppraisal.type,
        institution: newAppraisal.institution,
        status: 'pending',
        estimatedDate: dayjs().add(15, 'day').format('YYYY-MM-DD'),
        cost: parseInt(newAppraisal.cost) || 0,
        description: newAppraisal.description
      })
      
      showAddDialog.value = false
      Object.assign(newAppraisal, {
        caseTitle: '',
        type: '',
        institution: '',
        cost: '',
        description: ''
      })
      
      ElMessage.success('鉴定申请提交成功')
    }
    
    const getTypeColor = (type) => {
      const colorMap = {
        judicial: '',
        medical: 'danger',
        injury: 'warning',
        traffic: 'success',
        other: 'info'
      }
      return colorMap[type] || ''
    }
    
    const getTypeName = (type) => {
      const nameMap = {
        judicial: '司法鉴定',
        medical: '医疗鉴定',
        injury: '工伤鉴定',
        traffic: '交通事故鉴定',
        technical: '技术鉴定',
        property: '财产鉴定',
        other: '其他鉴定'
      }
      return nameMap[type] || type
    }
    
    // 案件阶段相关方法
    const getStageColor = (stage) => {
      const colorMap = {
        'pre-litigation': 'info',
        'litigation': 'warning',
        'mediation': 'success'
      }
      return colorMap[stage] || 'info'
    }
    
    const getStageName = (stage) => {
      const nameMap = {
        'pre-litigation': '诉前',
        'litigation': '诉中',
        'mediation': '和谈'
      }
      return nameMap[stage] || stage
    }
    
    const getStatusColor = (status) => {
      const colorMap = {
        pending: 'warning',
        'in-progress': 'primary',
        completed: 'success',
        cancelled: 'danger'
      }
      return colorMap[status] || ''
    }
    
    const getStatusName = (status) => {
      const nameMap = {
        pending: '待鉴定',
        'in-progress': '鉴定中',
        completed: '已完成',
        cancelled: '已取消'
      }
      return nameMap[status] || status
    }
    
    const formatDate = (date) => {
      return dayjs(date).format('YYYY-MM-DD')
    }
    
    // 报告状态相关方法
    const getReportStatusColor = (status) => {
      const colorMap = {
        'pending': 'warning',
        'uploaded': 'success',
        'reviewed': 'info'
      }
      return colorMap[status] || 'info'
    }
    
    const getReportStatusText = (status) => {
      const textMap = {
        'pending': '待上传',
        'uploaded': '已上传',
        'reviewed': '已审核'
      }
      return textMap[status] || '未知'
    }
    
    // 上传报告相关方法
    const uploadReport = (appraisal) => {
      currentAppraisal.value = appraisal
      showUploadDialog.value = true
      resetUploadForm()
    }
    
    const resetUploadForm = () => {
      uploadedFiles.value = []
      Object.assign(reportForm, {
        description: '',
        reportTypes: []
      })
    }
    
    const beforeUpload = (file) => {
      const isValidType = ['application/pdf', 'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'image/jpeg', 'image/png', 'image/jpg'].includes(file.type)
      const isLt50M = file.size / 1024 / 1024 < 50
      
      if (!isValidType) {
        ElMessage.error('只能上传 PDF、Word 文档或图片格式的文件！')
        return false
      }
      if (!isLt50M) {
        ElMessage.error('文件大小不能超过 50MB！')
        return false
      }
      return false // 阻止自动上传
    }
    
    const handleFileChange = (file, fileList) => {
      if (beforeUpload(file.raw)) {
        uploadedFiles.value = fileList
      }
    }
    
    const handleFileRemove = (file, fileList) => {
      uploadedFiles.value = fileList
    }
    
    const removeFile = (index) => {
      uploadedFiles.value.splice(index, 1)
    }
    
    const formatFileSize = (size) => {
      if (size < 1024) {
        return size + ' B'
      } else if (size < 1024 * 1024) {
        return (size / 1024).toFixed(1) + ' KB'
      } else {
        return (size / (1024 * 1024)).toFixed(1) + ' MB'
      }
    }
    
    const confirmUploadReport = async () => {
      if (uploadedFiles.value.length === 0) {
        ElMessage.warning('请选择要上传的文件')
        return
      }
      
      uploading.value = true
      
      try {
        // 模拟上传过程
        await new Promise(resolve => setTimeout(resolve, 2000))
        
        // 更新鉴定记录的报告状态
        const appraisal = appraisals.value.find(a => a.id === currentAppraisal.value.id)
        if (appraisal) {
          appraisal.reportStatus = 'uploaded'
          appraisal.status = 'completed'
        }
        
        ElMessage.success(`成功上传 ${uploadedFiles.value.length} 个文件`)
        showUploadDialog.value = false
        resetUploadForm()
      } catch (error) {
        ElMessage.error('上传失败，请重试')
      } finally {
        uploading.value = false
      }
    }
    
    // 材料管理相关方法
    const beforeMaterialUpload = (file) => {
      const isValidType = [
        'application/pdf',
        'application/msword',
        'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
        'image/jpeg',
        'image/jpg',
        'image/png',
        'application/zip',
        'application/x-rar-compressed'
      ].includes(file.type)
      
      const isLt10M = file.size / 1024 / 1024 < 10

      if (!isValidType) {
        ElMessage.error('只能上传 PDF、Word、图片或压缩包格式的文件!')
        return false
      }
      if (!isLt10M) {
        ElMessage.error('文件大小不能超过 10MB!')
        return false
      }
      return true
    }
    
    const handleMaterialChange = (file, fileList) => {
      materialFiles.value = fileList
    }
    
    const removeMaterialFile = (index) => {
      materialFiles.value.splice(index, 1)
    }
    
    const getFileIcon = (fileName) => {
      const ext = fileName.split('.').pop().toLowerCase()
      const iconMap = {
        pdf: 'fas fa-file-pdf text-red-500',
        doc: 'fas fa-file-word text-blue-500',
        docx: 'fas fa-file-word text-blue-500',
        jpg: 'fas fa-file-image text-green-500',
        jpeg: 'fas fa-file-image text-green-500',
        png: 'fas fa-file-image text-green-500'
      }
      return iconMap[ext] || 'fas fa-file text-gray-500'
        }

    const saveMaterials = async () => {
      try {
        // 模拟保存过程
        await new Promise(resolve => setTimeout(resolve, 1000))
        
        // 更新材料状态
        if (currentAppraisal.value) {
          const appraisal = appraisals.value.find(a => a.id === currentAppraisal.value.id)
          if (appraisal) {
            appraisal.materialStatus = 'complete'
          }
        }
        
        ElMessage.success('材料保存成功')
        showMaterialDialog.value = false
      } catch (error) {
        ElMessage.error('保存失败，请重试')
      }
    }
    
    const saveRemark = async () => {
      if (!remarkForm.content.trim()) {
        ElMessage.warning('请输入备注内容')
        return
      }
      
      try {
        // 模拟保存备注
        await new Promise(resolve => setTimeout(resolve, 500))
        
        ElMessage.success('备注保存成功')
        showRemarkDialog.value = false
      } catch (error) {
        ElMessage.error('保存失败，请重试')
      }
    }

    // 鉴定信息录入相关方法
    const inputAppraisalInfo = (appraisal) => {
      currentAppraisal.value = appraisal
      // 填充基本信息
      Object.assign(appraisalInputForm, {
        caseNo: appraisal.appraisalNo,
        caseName: appraisal.caseTitle,
        estimatedDisabilityLevel: '',
        estimatedCompensationRatio: '',
        injuryDescription: '',
        appraisalInstitution: '',
        appraisalType: appraisal.type,
        appointmentDate: null,
        estimatedCost: '',
        appraisalNotes: '',
        materialFiles: [],
        requiredMaterials: []
      })
      showAppraisalInputDialog.value = true
    }

    const batchInputAppraisal = () => {
      if (selectedCases.value.length === 0) {
        ElMessage.warning('请先选择要录入的案件')
        return
      }
      if (selectedCases.value.length > 1) {
        ElMessage.warning('批量录入功能暂未开放，请逐个录入')
        return
      }
      inputAppraisalInfo(selectedCases.value[0])
    }

    // 禁用过去的日期
    const disabledDate = (time) => {
      return time.getTime() < Date.now() - 8.64e7 // 禁用昨天之前的日期
    }

    // 材料上传相关方法
    const handleMaterialFileChange = (file, fileList) => {
      appraisalInputForm.materialFiles = fileList
    }

    const handleMaterialFileRemove = (file, fileList) => {
      appraisalInputForm.materialFiles = fileList
    }

    // 提交鉴定信息录入
    const submitAppraisalInput = async () => {
      try {
        // 表单验证
        await appraisalInputFormRef.value.validate()

        submitting.value = true

        // 模拟提交过程
        await new Promise(resolve => setTimeout(resolve, 2000))

        // 更新案件状态为"鉴定中"
        const index = appraisals.value.findIndex(item => item.id === currentAppraisal.value.id)
        if (index !== -1) {
          appraisals.value[index].status = 'in-progress'
          appraisals.value[index].materialStatus = 'complete'
          appraisals.value[index].scheduledDate = dayjs(appraisalInputForm.appointmentDate).format('YYYY-MM-DD')
          appraisals.value[index].estimatedCost = appraisalInputForm.estimatedCost
          appraisals.value[index].institution = getInstitutionName(appraisalInputForm.appraisalInstitution)
          
          // 添加录入的详细信息
          appraisals.value[index].appraisalDetails = {
            estimatedDisabilityLevel: appraisalInputForm.estimatedDisabilityLevel,
            estimatedCompensationRatio: appraisalInputForm.estimatedCompensationRatio,
            injuryDescription: appraisalInputForm.injuryDescription,
            appraisalNotes: appraisalInputForm.appraisalNotes,
            requiredMaterials: appraisalInputForm.requiredMaterials,
            materialFiles: appraisalInputForm.materialFiles,
            inputTime: new Date().toISOString()
          }
        }

        ElMessage.success('鉴定信息录入成功，案件已进入鉴定中状态')
        showAppraisalInputDialog.value = false
        
        // 自动切换到鉴定中选项卡
        activeTab.value = 'in-progress'
        
        // 清空表单
        Object.assign(appraisalInputForm, {
          caseNo: '',
          caseName: '',
          estimatedDisabilityLevel: '',
          estimatedCompensationRatio: '',
          injuryDescription: '',
          appraisalInstitution: '',
          appraisalType: '',
          appointmentDate: null,
          estimatedCost: '',
          appraisalNotes: '',
          materialFiles: [],
          requiredMaterials: []
        })

      } catch (error) {
        console.error('表单验证失败:', error)
      } finally {
        submitting.value = false
      }
    }

    // 获取机构名称
    const getInstitutionName = (code) => {
      const institutionMap = {
        'beijing-judicial': '北京市司法鉴定中心',
        'catarc': '中汽研汽车检验中心',
        'police-forensic': '市公安局法医鉴定中心',
        'provincial-judicial': '省司法鉴定协会',
        'traffic-forensic': '交通事故司法鉴定所',
        'road-traffic': '道路交通事故鉴定中心'
      }
      return institutionMap[code] || '未知机构'
    }
    
    return {
      loading,
      searchKeyword,
      currentPage,
      pageSize,
      activeTab,
      showAddDialog,
      showUploadDialog,
      showScheduleDialog,
      showMaterialDialog,
      showRemarkDialog,
      uploading,
      currentAppraisal,
      uploadedFiles,
      uploadRef,
      selectedCases,
      selectedDate,
      selectedPendingCases,
      materialFiles,
      filters,
      newAppraisal,
      reportForm,
      materialForm,
      remarkForm,
      missingMaterialForm,
      specimenList,
      showMissingMaterialDialog,
      submittingMissing,
      appraisalInputForm,
      appraisalInputRules,
      showAppraisalInputDialog,
      submitting,
      materialUploadRef,
      materialUploadAction,
      appraisalInputFormRef,
      requiredMaterials,
      filteredAppraisals,
      totalAppraisals,
      pendingAppraisals,
      inProgressAppraisals,
      completedAppraisals,
      urgentAppraisals,
      selectedDateCases,
      pendingScheduleCases,
      refreshData,
      applyFilters,
      clearFilters,
      handleTabChange,
      handleSelectionChange,
      isSelectable,
      clearSelection,
      batchSchedule,
      handleDateChange,
      getScheduleCount,
      handlePendingSelectionChange,
      confirmSchedule,
      viewAppraisal,
      editAppraisal,
      startAppraisal,
      manageMaterials,
      resetMaterialForm,
      manageMissingMaterials,
      resetMissingMaterialForm,
      submitMissingMaterials,
      sendNotificationToStakeholders,
      addRemark,
      viewReport,
      printMaterials,
      deleteAppraisal,
      addAppraisal,
      // 查看报告相关
      showReportDialog,
      reportDetails,
      generateReportContent,
      downloadFile,
      previewFile,
      printReport,
      exportReport,
      generatePrintContent,
      // 打印材料相关
      showPrintDialog,
      printSelection,
      printSettings,
      selectedMaterialsCount,
      confirmPrintMaterials,
      getTypeColor,
      getTypeName,
      getStageColor,
      getStageName,
      getStatusColor,
      getStatusName,
      formatDate,
      getReportStatusColor,
      getReportStatusText,
      uploadReport,
      resetUploadForm,
      beforeUpload,
      handleFileChange,
      handleFileRemove,
      removeFile,
      formatFileSize,
      confirmUploadReport,
      beforeMaterialUpload,
      handleMaterialChange,
      removeMaterialFile,
      getFileIcon,
      saveMaterials,
      saveRemark,
      inputAppraisalInfo,
      batchInputAppraisal,
      disabledDate,
      handleMaterialFileChange,
      handleMaterialFileRemove,
      beforeMaterialUpload,
      submitAppraisalInput,
      getInstitutionName
    }
  }
}
</script>

<style scoped>
.appraisal-management {
  padding: 24px;
  background-color: #f9fafb;
  min-height: 100vh;
}

/* 页面头部 */
.page-header {
  background: white;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-title {
  font-size: 28px;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 8px 0;
}

.page-subtitle {
  color: #6b7280;
  margin: 0;
  font-size: 14px;
}

.header-actions {
  display: flex;
  gap: 12px;
}

/* 统计区域 */
.stats-section {
  margin-bottom: 24px;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.stat-card {
  background: white;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.stat-icon {
  width: 60px;
  height: 60px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.stat-icon i {
  font-size: 24px;
}

.stat-content h3 {
  font-size: 24px;
  font-weight: bold;
  margin: 0 0 4px 0;
  color: #1f2937;
}

.stat-content p {
  margin: 0;
  color: #6b7280;
  font-size: 14px;
}

/* 筛选区域 */
.filter-section {
  background: white;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.filter-content {
  display: flex;
  gap: 16px;
  align-items: center;
}

.search-box {
  flex: 1;
  max-width: 400px;
}

.filter-controls {
  display: flex;
  gap: 12px;
  align-items: center;
}

/* 鉴定列表 */
.appraisal-list-section {
  background: white;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.pagination-section {
  display: flex;
  justify-content: center;
  padding-top: 24px;
  border-top: 1px solid #e5e7eb;
  margin-top: 24px;
}

/* 页签样式 */
.tabs-section {
  background: white;
  border-radius: 12px;
  padding: 20px 20px 0 20px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.appraisal-tabs {
  border-bottom: 1px solid #e5e7eb;
}

.tab-label {
  display: flex;
  align-items: center;
  font-weight: 500;
}

/* 筛选区域增强 */
.stage-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: #f8fafc;
  border-radius: 6px;
}

.stage-filter .el-select {
  flex-shrink: 0;
}

.filter-label {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  white-space: nowrap;
}

.batch-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  margin-top: 16px;
}

.batch-info {
  color: #1e40af;
  font-weight: 500;
}

.batch-buttons {
  display: flex;
  gap: 8px;
}

/* 材料状态 */
.material-status {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* 排期管理对话框 */
.schedule-management {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.calendar-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.calendar-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4px;
}

.date-number {
  font-size: 14px;
  font-weight: 500;
}

.schedule-indicator {
  font-size: 10px;
  color: #3b82f6;
  background: #dbeafe;
  padding: 1px 4px;
  border-radius: 4px;
  margin-top: 2px;
}

.date-cases,
.pending-cases {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* 材料管理对话框 */
.material-management {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 缺少检材管理对话框 */
.missing-material-management {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.specimen-checklist {
  .section-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 16px;
    color: #333;
    display: flex;
    align-items: center;
  }
  
  .specimen-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 12px;
    
    .specimen-item {
      padding: 12px;
      border: 1px solid #e1e5e9;
      border-radius: 6px;
      transition: all 0.2s;
      
      &:hover {
        border-color: #409eff;
        background-color: #f0f9ff;
      }
      
      .specimen-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        
        .specimen-info {
          flex: 1;
          
          .specimen-name {
            font-weight: 500;
            color: #333;
            display: block;
            margin-bottom: 4px;
          }
          
          .specimen-desc {
            font-size: 12px;
            color: #666;
          }
        }
      }
    }
  }
}

.missing-reason, .additional-notes {
  .form-label {
    display: block;
    font-weight: 500;
    color: #333;
    margin-bottom: 8px;
  }
}

.stakeholder-notification {
  .section-title {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 16px;
    color: #333;
    display: flex;
    align-items: center;
  }
  
  .stakeholder-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
    
    .stakeholder-item {
      padding: 12px;
      border: 1px solid #e1e5e9;
      border-radius: 6px;
      transition: all 0.2s;
      
      &:hover {
        border-color: #67c23a;
        background-color: #f0f9ff;
      }
      
      .stakeholder-info {
        margin-left: 8px;
        
        .stakeholder-name {
          font-weight: 500;
          color: #333;
          display: block;
        }
        
        .stakeholder-desc {
          font-size: 12px;
          color: #666;
        }
      }
    }
  }
}

.urgency-level {
  .form-label {
    display: block;
    font-weight: 500;
    color: #333;
    margin-bottom: 12px;
  }
  
  .el-radio {
    display: block;
    margin-bottom: 8px;
    
    .ml-2 {
      margin-left: 8px;
      color: #666;
      font-size: 14px;
    }
  }
}

/* 查看报告对话框样式 */
.report-dialog {
  .report-content {
    max-height: 70vh;
    overflow-y: auto;
  }
  
  .report-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e5e7eb;
    
    h2 {
      color: #1f2937;
      margin-bottom: 15px;
      font-size: 24px;
      font-weight: bold;
    }
    
    .report-meta {
      display: flex;
      justify-content: space-between;
      color: #6b7280;
      font-size: 14px;
      
      .report-no, .report-date {
        padding: 4px 12px;
        background: #f3f4f6;
        border-radius: 4px;
      }
    }
  }
  
  .section-title {
    font-size: 16px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 16px;
    padding-left: 12px;
    border-left: 4px solid #3b82f6;
    display: flex;
    align-items: center;
  }
  
  .basic-info-section, .conclusion-section, 
  .analysis-section, .opinion-section, 
  .files-section {
    margin-bottom: 25px;
  }
  
  .conclusion-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    
    .conclusion-item {
      padding: 15px;
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 8px;
      
      label {
        display: block;
        font-weight: 500;
        color: #64748b;
        margin-bottom: 8px;
      }
      
      .conclusion-value {
        font-size: 16px;
        font-weight: 600;
        
        &.disability { color: #dc2626; }
        &.ratio { color: #7c3aed; }
        &.injury { color: #ea580c; }
        &.mental { color: #059669; }
      }
    }
  }
  
  .analysis-steps {
    .analysis-step {
      margin-bottom: 20px;
      padding: 20px;
      background: #f8fafc;
      border-radius: 8px;
      border-left: 4px solid #3b82f6;
      
      .step-title {
        display: flex;
        align-items: center;
        font-weight: 600;
        color: #374151;
        margin-bottom: 12px;
        
        i {
          margin-right: 8px;
          color: #3b82f6;
        }
      }
      
      .step-content {
        color: #6b7280;
        line-height: 1.6;
      }
    }
  }
  
  .opinion-list {
    margin: 0;
    padding-left: 20px;
    
    li {
      margin-bottom: 12px;
      color: #374151;
      line-height: 1.6;
    }
  }
  
  .file-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 15px;
    
    .file-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px;
      border: 1px solid #e5e7eb;
      border-radius: 8px;
      transition: all 0.2s;
      
      &:hover {
        border-color: #3b82f6;
        background-color: #f8fafc;
      }
      
      .file-info {
        display: flex;
        align-items: center;
        flex: 1;
        
        i {
          font-size: 24px;
          margin-right: 12px;
        }
        
        .file-details {
          .file-name {
            font-weight: 500;
            color: #374151;
            margin-bottom: 4px;
          }
          
          .file-size {
            font-size: 12px;
            color: #6b7280;
          }
        }
      }
      
      .file-actions {
        display: flex;
        gap: 8px;
      }
    }
  }
}

/* 打印材料对话框样式 */
.print-material-selection {
  .case-info {
    padding: 16px;
    background: #f8fafc;
    border-radius: 8px;
    margin-bottom: 20px;
    
    h4 {
      margin: 0 0 12px 0;
      color: #374151;
      font-size: 16px;
    }
    
    .info-row {
      display: flex;
      margin-bottom: 8px;
      
      .label {
        font-weight: 500;
        color: #6b7280;
        width: 80px;
      }
      
      .value {
        color: #374151;
      }
    }
  }
  
  .material-selection, .print-options, .material-preview {
    margin-bottom: 25px;
    
    h4 {
      margin: 0 0 16px 0;
      color: #374151;
      font-size: 16px;
      font-weight: 600;
    }
  }
  
  .material-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 15px;
    
    .material-category {
      .el-checkbox {
        width: 100%;
        
        .category-content {
          display: flex;
          align-items: center;
          padding: 16px;
          border: 1px solid #e5e7eb;
          border-radius: 8px;
          transition: all 0.2s;
          background: #ffffff;
          
          &:hover {
            border-color: #3b82f6;
            background-color: #f8fafc;
          }
          
          .category-icon {
            font-size: 24px;
            margin-right: 12px;
            color: #6b7280;
          }
          
          .category-info {
            flex: 1;
            
            .category-title {
              font-weight: 500;
              color: #374151;
              margin-bottom: 4px;
            }
            
            .category-desc {
              font-size: 12px;
              color: #6b7280;
              line-height: 1.4;
            }
          }
        }
      }
      
      .el-checkbox.is-checked .category-content {
        border-color: #3b82f6;
        background-color: #eff6ff;
        
        .category-icon {
          color: #3b82f6;
        }
      }
    }
  }
  
  .print-options {
    .option-row {
      margin-bottom: 15px;
      
      .el-radio-group .el-radio {
        margin-right: 20px;
      }
      
      .el-checkbox {
        margin-right: 20px;
      }
    }
  }
  
  .material-preview {
    .preview-list {
      display: flex;
      flex-direction: column;
      gap: 12px;
      
      .preview-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: #f1f5f9;
        border-radius: 6px;
        
        i {
          margin-right: 12px;
          color: #64748b;
        }
        
        span {
          flex: 1;
          color: #374151;
          font-weight: 500;
        }
      }
    }
  }
}

.case-info {
  padding: 16px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
}

.material-checklist {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.checklist-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 12px;
}

.material-item {
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: #fafafa;
}

.material-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.material-name {
  font-weight: 500;
  color: #374151;
}

.material-upload {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.upload-hint {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
}

/* 材料预览 */
.material-preview {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.file-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.file-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  background: white;
}

.file-icon {
  flex-shrink: 0;
}

.file-info {
  flex: 1;
  min-width: 0;
}

.file-name {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-size {
  font-size: 12px;
  color: #6b7280;
}

.file-actions {
  display: flex;
  gap: 4px;
}

.material-remark {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* 响应式设计 */
@media (max-width: 1024px) {
  .header-content {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  
  .filter-content {
    flex-direction: column;
    align-items: stretch;
  }
  
  .filter-controls {
    justify-content: center;
    flex-wrap: wrap;
  }
  
  .batch-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  
  .stage-filter {
    flex-direction: column;
    align-items: stretch;
  }
  
  .stage-filter .el-select {
    width: 100% !important;
  }
  
  .checklist-grid {
    grid-template-columns: 1fr;
  }
  
  .file-grid {
    grid-template-columns: 1fr;
  }
}

/* 上传报告对话框样式 */
.upload-report-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.appraisal-info {
  padding: 16px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
}

.info-title {
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 12px 0;
  display: flex;
  align-items: center;
}

.info-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.info-item {
  display: flex;
  align-items: center;
  font-size: 14px;
}

.info-label {
  color: #6b7280;
  min-width: 80px;
}

.info-value {
  color: #1f2937;
  font-weight: 500;
}

.upload-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.section-title {
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
  display: flex;
  align-items: center;
}

.file-upload-area {
  border: 2px dashed #d1d5db;
  border-radius: 8px;
  padding: 24px;
  text-align: center;
  transition: border-color 0.3s ease;
}

.file-upload-area:hover {
  border-color: #3b82f6;
}

.upload-hint {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.uploaded-files {
  margin-top: 16px;
}

.files-title {
  font-size: 14px;
  font-weight: 600;
  color: #374151;
  margin: 0 0 12px 0;
}

.file-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.file-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  background: #f8fafc;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
}

.file-info {
  display: flex;
  align-items: center;
  flex: 1;
}

.file-name {
  font-weight: 500;
  color: #1f2937;
  margin-right: 8px;
}

.file-size {
  color: #6b7280;
  font-size: 12px;
}

.report-description,
.report-type {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form-label {
  font-size: 14px;
  font-weight: 500;
  color: #374151;
}

.dialog-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

@media (max-width: 768px) {
  .appraisal-management {
    padding: 16px;
  }
  
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .info-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  
  .file-upload-area {
    padding: 16px;
  }
}

/* 鉴定信息录入对话框样式 */
.appraisal-input-content {
  max-height: 70vh;
  overflow-y: auto;
}

.form-section {
  margin-bottom: 32px;
  padding: 20px;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 4px solid #3b82f6;
}

.form-section:last-child {
  margin-bottom: 0;
}

.form-section .section-title {
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.material-upload-area {
  margin-top: 16px;
}

.upload-content {
  text-align: center;
  padding: 40px 20px;
  color: #6b7280;
}

.upload-icon {
  font-size: 48px;
  color: #9ca3af;
  margin-bottom: 16px;
}

.upload-text p {
  margin: 0;
  font-size: 14px;
}

.upload-text em {
  color: #3b82f6;
  font-style: normal;
}

.upload-tip {
  font-size: 12px;
  color: #9ca3af;
  margin-top: 8px !important;
}

.material-checklist {
  margin-top: 24px;
  padding: 20px;
  background: white;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
}

.material-checklist h4 {
  font-size: 14px;
  font-weight: 600;
  color: #374151;
  margin: 0 0 16px 0;
}

.checkbox-item {
  margin-bottom: 12px;
}

.checkbox-item:last-child {
  margin-bottom: 0;
}

/* 上传文件列表样式增强 */
.el-upload-list {
  margin-top: 16px;
}

.el-upload-list__item {
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 8px 12px;
  margin-bottom: 8px;
  background: white;
}

.el-upload-list__item:hover {
  background: #f9fafb;
}

/* 表单验证错误样式 */
.el-form-item.is-error .el-input__inner,
.el-form-item.is-error .el-textarea__inner,
.el-form-item.is-error .el-select .el-input__inner {
  border-color: #f56565;
}

/* 响应式样式 */
@media (max-width: 768px) {
  .form-section {
    padding: 16px;
    margin-bottom: 20px;
  }
  
  .upload-content {
    padding: 30px 15px;
  }
  
  .upload-icon {
    font-size: 36px;
  }
  
  .material-checklist {
    padding: 16px;
  }
}
</style> 